<ion-header>
  <div class="uh bor_b bc-head" data-control="HEADER" id="Header">
    <div class="ub">
      <div class="nav-btn" id="nav-left" (click)="navCtrl.pop()">
        <div class="ub-img1 back_btn_img"></div>
      </div>
      <h1 class="ut ub-f1 ulev-3 ut-s tx-c color_black" tabindex="0">新建挑战</h1>
      <div class="nav-btn" id="nav-right"></div>
    </div>
  </div>
</ion-header>

<ion-content>
  <div class=" " data-control="CONTENT" id="ScrollContent_dMIpN4">
    <div class="scrollbox">
      <div class="ub   ub-ver " id="dt_list" style="overflow: hidden;">

        <div class="wizard">
          <div class="wizard-title"> 获胜率是我们说到做到的终极信用 </div>
          <ul class="steps" style="margin-left: 0">
            <li [ngClass]="{'active': steps.step1,'complete':steps.step2||steps.step3}">
              <span class="title">选择模块</span>
              <span class="step"></span>
            </li>
            <li [ngClass]="{'active': steps.step2,'complete':steps.step3}">
              <span class="title">填写规则</span>
              <span class="step"></span>
            </li>
            <li [ngClass]="{'active': steps.step3}">
              <span class="title">宣誓环节</span>
              <span class="step"></span>
            </li>
          </ul>
        </div>
        <div class="partition"></div>
        <div style="margin-bottom: 20px;" [hidden]="!steps.step1">
          <div class="wizardShow1List">
            <ng-container *ngFor="let item of wizardShow1List">
              <div class="wizarItem" (click)="wizarItem(item)">
                <img style="float:left;" src="{{item.FileImg | imgUrl:'DynamicUrl'}}">
                <div class="context">
                  <label>{{item.Desc}}</label>
                  <p>{{item.Introduction}}</p>
                </div>
              </div>
            </ng-container>
          </div>
        </div>

        <div [hidden]="!steps.step2">
          <div class="ub ub-ac height6 pad_left7 pad_right7 bor_b bc-head">
            <div class="ub ub-f1 fontsize9">
              挑战主题
            </div>
            <div class="uinput ub ub-f1">
              <input id="content1" [(ngModel)]="pageData.Title" onkeyup="this.value=this.value.replace(/\uD83C[\uDF00-\uDFFF]|\uD83D[\uDC00-\uDE4F]/g,'');if(this.value.length>20){this.value=this.value.substring(0,20);}"
                class="tx-r" placeholder="填写挑战主题(1-20)字" type="text" class="ub-f1" style=" text-align: right;">
            </div>
          </div>

          <!-- 挑战模式 单人 对战 多人 -->
          <div class="ub ub-ac height6 pad_left7 pad_right7 bor_b bc-head" (click)="moshi()">
            <div class="ub ub-f1 fontsize9">
              挑战模式
            </div>
            <div id="type" class="fontcolor999">{{ pageData.Pattern | dataWallet:'Pattern' }}</div>
            <div class="ub-img right_img"></div>
          </div>

          <div class="ub ub-ac height6 pad_left7 pad_right7 bor_b bc-head " *ngIf="pageData.Classify==30" id="hideorshow1">
            <div class="ub ub-f1 fontsize9">
              挑战数值
            </div>
            <div class="uinput ub ub-f1">
              <input [(ngModel)]="pageData.Number" id="count" class="tx-r ub-f1" placeholder="请输入数值" type="number" style=" text-align: right;">
            </div>
          </div>
          <!-- 挑战周数  1~26  -->
          <div class="ub ub-ac height6 pad_left7 pad_right7 bor_b bc-head " id="hideorshow2">
            <div class="ub ub-f1 fontsize9"> 挑战周数</div>
            <div class="uinput ub ub-f1">
              <input [(ngModel)]="pageData.Week" (keyup)="Weekdate($event,pageData.Week)" id="week" class="tx-r ub-f1" placeholder="请输入周数(1-26)"
                type="number" style="text-align: right;">
            </div>
          </div>
          <!--  -->
          <div class="ub ub-ac height6 pad_left7 pad_right7 bor_b bc-head" (click)="WeekRate()" id="hideorshow3">
            <div class="ub ub-f1 fontsize9">每周上传天数</div>
            <div class="tx-r ub ub-pe " id="WeekRate">{{pageData.WeekRate==0?"未设置":pageData.WeekRate}}</div>
            <div class="ub-img right_img"></div>
          </div>

          <div class="ub ub-ac height6 pad_left7 pad_right7 bor_b bc-head">
            <div class="ub ub-f1 fontsize9">
              战豆数量
            </div>
            <div class="uinput ub ub-f1">
              <input [(ngModel)]="pageData.Integral" id="integral" class="tx-r ub-f1" placeholder="请输入参与战豆(100-10000)" type="number" style="text-align: right;">
            </div>
          </div>
          <div class="ub ub-ac  pad_left7 pad_right7 umh5" style="background-color:#EEEEEE;">
            <div class="ub ub-f1 fontsize9"> 挑战时间 </div>
          </div>
          <!--   -->
          <div class="ub ub-ac height6 pad_left7 pad_right7 bor_b bc-head">
            <div class="ub ub-f1">开始时间</div>
            <ion-datetime displayFormat="YYYY-MM-DD" min="{{newLeave}}" cancelText="取消" doneText="确定" [(ngModel)]="pageData.StartDate"
              (ngModelChange)="changeDate($event)"></ion-datetime>
            <div class="ub-img right_img"></div>
          </div>
          <div class="ub ub-ac height6 pad_left7 pad_right7 bor_b bc-head " [hidden]="endtimea">
            <div class="ub ub-f1">结束时间</div>
            <div id="endTime" class="fontcolor999"> {{pageData.EndDate==""?'未设置':pageData.EndDate}} </div>
            <div class="ub-img right_img_wh"></div>
          </div>
          <div class="ub ub-ac height6 pad_left7 pad_right7 bor_b bc-head " [hidden]="!endtimea" (click)="endTime()">
            <div class="ub ub-f1">结束时间</div>
            <ion-datetime displayFormat="YYYY-MM-DD" cancelText="取消" doneText="确定" max="pageData.StartDat" [(ngModel)]="pageData.EndDate"></ion-datetime>
            <div class="ub-img right_img"></div>
          </div>
          <div class="ub ub-ac  pad_left7 pad_right7 umh5" style="background-color:#EEEEEE;">
            <div class="ub ub-f1 fontsize9">挑战内容</div>
          </div>
          <div class="ub ub-ver pad_left7 pad_right7 bor_b bc-head" style="padding-bottom: 0.7em;">
            <textarea [(ngModel)]="pageData.Describe" (keyup)="filteremoji($event,pageData.Describe)" id="content2" class="wenben bg-ff "
              placeholder="请填写挑战规则的简要描述"></textarea>
            <div class="ub">
              <div id="imglist" class="ub showpic"></div>
              <div class="ub ub-ver ub-ac ub-pc">
                <img (click)="uploadimg()" *ngIf="Media.isUploadImg"  class="openpic addpic widrth_35" src="assets/imgs/img/uploadPic.png"/>
                <img (click)="uploadimg()" *ngIf="!(Media.isUploadImg)"  class="openpic addpic widrth_35" src="{{Media.loadImgsrc | imgUrl:'DynamicUrl'}}" />
                <div class="umar-t">上传图片</div>
                <div class="fontcolor999 fontsize8">（最多一张）</div>
              </div>
            </div>
          </div>
          <div class="ub ub-ver pad_left7 pad_right7  bor_b bc-head mar_t5 " [hidden]="!hideor">

            <div class="ub ub-ac umh5 ">邀请战友</div>
            <div class="ub  ub-f1 pad_b5" id="userlist">
              <img class="wh_h mar_r2 yuan widrth_35" *ngFor="let item of MyfriendList" src="{{item.HeadPortrait | imgUrl:'base64' }}"
              />
              <img class="wh_h mar_r2 widrth_35" (click)="openInvitationFriend_home()" src="assets/imgs/img/yaoqinghaoyou.png" />
            </div>
          </div>
          <button ion-button color="danger" block (click)="nextBtn1()">下一步</button>
        </div>
        <div [hidden]="!steps.step3">
          <div class="ub ub-ver pad_left7 pad_right7 bor_b bc-head">
            <div class="vides" (click)="addVideo()">宣誓视频</div>

            <div class="ub  ub-f1 pad_b5" id="userlist"  style="display:none;" (click)="uploadvoide()">
              <img class="wh_h mar_r2 yuan widrth_35"  src="" />
            </div>
          </div>
          <div class="ub ub-ver pad_left7 pad_right7 bor_b bc-head">
            <div class="fontcolor999 umar-r">
              <span style="color:#111111;">我的奖励与惩罚</span>
              <div style="float: right;width:30%;min-width:136px;">谁可以看 <span>{{pageData.IsReward?"公开":"私有"}}</span>
               <span style="float: right;"><ion-toggle [(ngModel)]="pageData.IsReward"></ion-toggle></span>   
              </div>
            </div>
            <textarea [(ngModel)]="pageData.rewardMessage"   class="wenben bg-ff " placeholder="填写达成目标对自己的奖励"></textarea>
          </div>

          <button ion-button color="danger" block (click)="nextBtn1()">完成</button>
        </div>
      </div>
    </div>
  </div>
</ion-content>

<!-- <ion-backdrop [hidden]="!showMoreActionFlag"  class="study-detail-backdrop" disable-activated=""  role="presentation" tappable="" style="opacity: 0.2;"></ion-backdrop> -->

